<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>		
        <title>Chart</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
            <link href="../../../styles.css" rel="stylesheet" />
            <script src="jquery-1.9.1.min.js"></script>
            <script src="knockout-2.2.1.js"></script>
            <script src="globalize.min.js"></script>
            <script src="dx.chartjs.js"></script>

    </head>
    <body>
        <script type="text/javascript">
            var dataSource = JSON.parse('[{"title":"Dong Duong","data":[{"choice":"L","num":100},{"choice":"Viet N","num":100},{"choice":"campudia","num":100}]},{"title":"Dong a","data":[{"choice":"Nhat ban","num":123},{"choice":"Han quoc","num":456},{"choice":"trung uoc","num":789}]}]');
            $(function()
            {


                $(".chartContainer").each(function(i) {
                    var type = $(this).attr("typeanswer");
                    if (type === "0") {
                        $(this).dxPieChart({
                            size: {
                                width: 500
                            },
                            dataSource: dataSource[i].data,
                            series: [
                                {
                                    argumentField: "choice",
                                    valueField: "num",
                                    label: {
                                        visible: true,
                                        connector: {
                                            visible: true,
                                            width: 1
                                        }
                                    }
                                }
                            ],
                            title: dataSource[i].title
                        });
                    }
                    else {

                        $(this).dxChart({
                            dataSource: dataSource[i].data,
                            series: {
                                argumentField: "choice",
                                valueField: "num",
                                name: dataSource[i].title,
                                type: "bar",
                                color: '#ffa500'
                            }

                        });
                    }
                });
            });
        </script>

        <div class="chartContainer" typeanswer="0" style="width: 400px; height: 440px;"></div>
        <div class="chartContainer" typeanswer="1"  style="width: 400px; height: 440px;"></div>
  

    </body>
</html>